<%--
  Created by IntelliJ IDEA.
  User: asd73
  Date: 2017/9/21
  Time: 19:15
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<html>
<head>
    <title>First jQuery Demo</title>
    <style type="text/css">
        div{
            padding:8px 0px;
            font-size:12px;
            border:1px solid #888;
        }
    </style>
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            //$("html").html("南海科技大学欢迎你！");
            //$("*").html("南海科技大学欢迎你！");
            $("div").html("Hello");//$("div").html()是使用标签选择器获取div标签
            var $p = $('#onlyou');
            $p.html('p2:hello by jquery').css('color','red');
        });
    </script>
    <%--$(document).ready 的作用是等页面的文档（document）中的节点都加载完毕后，
    再执行后续的代码，因为我们在执行代码的时候，可能会依赖页面的某一个元素，
    我们要确保这个元素真正的的被加载完毕后才能正确的使用。--%>

    <script type="text/javascript">
        $(function(){//jq的入口函数
            $('button').click(function () {
                $('div').hide(10000);
            })
        })
    </script>

    <script type="text/javascript">
        $(function () {
            alert(1);
        })
    </script>
</head>
<body>
    <button>按钮</button>
    <div></div>
</body>
</html>
